<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core">

    <body>
        <ui:composition template="../resources/sTemplate.xhtml">
            <ui:define name="left">
                <h:form>
                    <h:panelGrid columns="1"> 
                        <p:panel >  
                            <h:commandLink id="filterButton" 
                                           onclick="PF('dialogFilter').show();
                                                   return false;" type="button"> 
                                <h:graphicImage library="img" name="icons/search.ico" width="32px;"/>
                            </h:commandLink>  
                            <p:separator/>

                            <h:commandLink>  
                                <h:graphicImage library="img" name="icons/excel.png" width="32px;"/>
                                <p:dataExporter type="xls" target=":formDataTable:dataTable" fileName="sofia" />  
                            </h:commandLink>  

                            <p:separator/>

                            <h:commandLink>  
                                <h:graphicImage library="img" name="icons/pdf.png" width="32px;"/>
                                <p:dataExporter type="pdf" target=":formDataTable:dataTable" fileName="sofia"/>  
                            </h:commandLink>  

                        </p:panel>
                    </h:panelGrid>
                </h:form>
            </ui:define>

            <ui:define name="content" >
                <p:growl id="msgs" showDetail="true" />
                <div class="container" >
                    <h:form id="formDataTable">
                        <p:dataTable id="dataTable"  
                                     value="#{marcacionesBean.lista}" 
                                     var="var" 
                                     paginator="true" 
                                     rows="10"  
                                     paginatorPosition="bottom" 
                                     pageLinks="5"
                                     paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown} {CurrentPageReport}"  
                                     rowsPerPageTemplate="10,20,30,50,100,200,500">

                            <p:column headerText="Documento" style="width: 100px; text-align: right;" >  
                                <h:outputText value="#{var.TTerceros.documentoNumber}" >
                                    <f:convertNumber pattern="###,###,###,###,###" type="number"/>
                                </h:outputText>
                            </p:column>

                            <p:column headerText="Empleado" >  
                                <h:outputText value="#{var.TTerceros.apellidoNombre}" />  
                            </p:column>

                            <p:column headerText="Entrada" style="width:  160px; white-space: nowrap;">  
                                <h:outputText value="#{var.entrada}" style="text-align: right;"/>  
                            </p:column>

                            <p:column headerText="Salida" style="width:  160px; white-space: nowrap;">  
                                <h:outputText value="#{var.salida}" style="text-align: right;"/>  
                            </p:column>

                            <p:column headerText="Dia" style="width: 100px; text-align: center;">  
                                <h:outputText value="#{var.diaSemana}"/>  
                            </p:column>

                        </p:dataTable>
                    </h:form>
                    <!--                        
                   
                   Dialogo de Filtro de registro          
                                           
                    -->
                    <h:form id="formFilter">
                        <p:dialog header="Filtro" widgetVar="dialogFilter" resizable="false" id="dlgFilter"  
                                  showEffect="fade" hideEffect="drop" modal="true">  

                            <h:panelGrid id="display" columns="1" cellpadding="4" style="margin:0 auto;">  

                                <h:panelGrid id="displayNombre" columns="2" cellpadding="0" style="margin:0 auto;">  
                                    <h:outputText value="Empleado:" />  
                                    <h:inputText value="#{marcacionesBean.apellidoNombre}" 
                                                 size="60" style="text-transform: uppercase;"/>  
                                </h:panelGrid>

                                <h:panelGrid id="displayFechas" columns="4" cellpadding="-4" style="margin:0 auto;">  
                                    <h:outputText value="Fecha Inicial:" />  
                                    <p:calendar value="#{marcacionesBean.fechaInicial}" id="fechaInicialCal" showOn="button" size="8"/>

                                    <h:outputText value="Fecha Final:" />  
                                    <p:calendar value="#{marcacionesBean.fechaFinal}" id="fechaFinalCal" showOn="button" size="8"/>
                                </h:panelGrid>

                                <f:facet name="footer">
                                    <p:separator/>
                                    <p:commandButton id="consultarBtn"
                                                     value="Consultar"  
                                                     update=":formDataTable:dataTable, :msgs" 
                                                     oncomplete="PF('dialogFilter').hide()" />

                                    <p:commandButton id="cancelarFiltrar"
                                                     value="Cancelar"
                                                     update=":formFilter:display" 
                                                     oncomplete="PF('dialogFilter').hide()" />

                                    <p:commandButton id="limpiarFiltrar"
                                                     value="limpiar"
                                                     update=":formFilter:display, :formDataTable:dataTable, :msgs" 
                                                     oncomplete="PF('dialogFilter').hide()" 
                                                     action="#{marcacionesBean.inicializarConsulta()}"/>

                                </f:facet>
                            </h:panelGrid>  
                        </p:dialog>  
                    </h:form>

                </div>
            </ui:define>
        </ui:composition>
    </body>
</html>
